import React from 'react';
import { inject, observer } from 'mobx-react';
import {Spin,Button} from 'antd'
import { WeaTab,WeaBrowser,WeaPopoverHrm,WeaNewScrollPagination,WeaInput,WeaDialog,WeaLocaleProvider } from 'ecCom';
import DoorList from './DoorList';
import DoorAddTask from './DoorAddTask';
import '../../style/task/taskDoorPage.less'
const getLabel = WeaLocaleProvider.getLabel;
let topTab = [
    {
        color: '#ff3232',
        groupid: 'todaytask',
        showcount: true,
        title: getLabel(19865,'我的任务'),
        viewcondition: 1
    },
    {
        color: '#ff3232',
        groupid: 'flowtask',
        showcount: true,
        title: getLabel(508734,'下属任务'),
        viewcondition: 2
    }
];
@inject('devDoorpage')
@observer
export default class DoorPage extends React.Component {
    constructor(props) {
        super(props);
    }
    componentWillMount() {//一些初始化请求
        const { devDoorpage } = this.props;
        devDoorpage.getDatas({"firstreq":1});
    }
    changeData=(theKey)=> {
        const { devDoorpage } = this.props;
        //alert(devDoorpage.count.todaytask)
        devDoorpage.datakey = theKey;
        if(theKey==2){
            devDoorpage.binputstyle = {width: 100,display:'block'};
        }else{
            devDoorpage.binputstyle = {width: 100,display:'none'};
        }
        devDoorpage.currentindex = theKey;
        devDoorpage.pageNum = 1;
        devDoorpage.getDatas({"indexid":theKey,"hrmid":devDoorpage.inputval,"pagenum":devDoorpage.pageNum});
    }
    hrmChange(ids){
        const { devDoorpage } = this.props;
        devDoorpage.inputval = ids;
        devDoorpage.getDatas({"hrmid":ids,"indexid":2});
    }
    onScrollEnd=()=>{
        const { devDoorpage } = this.props;
        devDoorpage.pageNum = parseInt(devDoorpage.pageNum)+1;
        if(parseInt(devDoorpage.pageNum)<=parseInt(devDoorpage.totalPage)){
            devDoorpage.loading = true;
            devDoorpage.getScrollDatas({"indexid":devDoorpage.currentindex,"hrmid":devDoorpage.inputval,"pagenum":devDoorpage.pageNum,"addtaskid":devDoorpage.addId});
        }
    }
    openClick(theKey,idx){
        const { devDoorpage } = this.props;
        devDoorpage.dataSource[idx].imgclass="noimg";
        devDoorpage.dataSource[idx].imgtitle = ""; 
        window.open("/spa/workrelate/static/index.html?#/main/workrelate/task/taskDetail?id="+theKey);
    }
    execOperation(id,changetype,idx){
        const { devDoorpage } = this.props;
        if(changetype==2){
            devDoorpage.toChangeStatus({"idx":idx,"taskId":id,"status":changetype});
        }else{
            devDoorpage.setSpecial({"idx":idx,"taskid":id,"special":changetype});
        }
    }
    addTaskBlur(thevalue){
        if(thevalue!=""){
            const { devDoorpage } = this.props;
            devDoorpage.fastAddTask({"taskName":thevalue});
        }
    }
    addTaskChange(thevalue){
        const { devDoorpage } = this.props;
        devDoorpage.addtaskval = thevalue;
    }
    addTaskButtonClick=()=>{
        const { devDoorpage } = this.props;
        devDoorpage.open();
    }
    render() {
        const { devDoorpage } = this.props;
        return (
            <div className="workrelate-task-doorPage">
                <div style={{height:48,whiteSpace:"nowrap"}}>
                    <div style={{display:'inline-block',verticalAlign:"middle"}}>
                        <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@lvh1pf`}
                            datas={topTab}
                            counts={devDoorpage.count}
                            keyParam="viewcondition"  //主键
                            countParam="groupid" //数量
                            onChange={this.changeData}
                            selectedKey={devDoorpage.datakey}
                        />
                    </div>
                    <div style={{display: "inline-block",verticalAlign:"middle"}}>
                    <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@m1wyul`}/>
                    <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@9o34cv`}
                            type={"wrltsk"}
                            completeURL = "/api/workrelate/task/doorpage/getUnderlingHrmInfo?"
                            inputStyle={devDoorpage.binputstyle} hideOps={true}
                            onChange={(ids, names, datas)=> this.hrmChange(ids)}
                        />
                    </div>
                </div>
                <WeaNewScrollPagination ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScrollPagination@f5iiqw`} height={100} loading = {devDoorpage.loading} intervalTime={500} offset={10} onScrollEnd = {this.onScrollEnd}>
                   <DoorList ecId={`${this && this.props && this.props.ecId || ''}_DoorList@316pvu`} dataSource={devDoorpage.dataSource} 
                             onClick={(ids,idx) => this.openClick(ids,idx)} 
                             execOperation={(ids,changetype,idx) => this.execOperation(ids,changetype,idx)}/>
                   <div className="loadingexample">
                      <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@6zev7r`} spinning={devDoorpage.loading}></Spin>
                   </div>
                </WeaNewScrollPagination>
                <div className="iptdiv">
                    <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@wym8zf`} id='addtask' className="intext" value = {devDoorpage.addtaskval} onChange = {(value) => this.addTaskChange(value)}
                        placeholder={getLabel(508695,'请输入一句话快速创建任务')} onBlur ={(value) => this.addTaskBlur(value)} />
                    <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@j3zy8a`} type="ghost" className="addtask" onClick={this.addTaskButtonClick}>+{getLabel(15266,'新建任务')}</Button>
                </div>
                <DoorAddTask ecId={`${this && this.props && this.props.ecId || ''}_DoorAddTask@lmvyx3`} title={getLabel(15266,'新建任务')} visible = {devDoorpage.status.createvisable}
                         onlyClose={() => { devDoorpage.onlyClose() }}//关闭回调,关闭/取消等按钮会自动调用该回调，只做关闭操作
                         doClose={() =>{ devDoorpage.doClose()}} doRefresh = {() =>  devDoorpage.doRefresh()}
                           style={{width: 700, height: 370}}></DoorAddTask>
            </div>
        )
    }
};